<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>

    <link rel="icon" type="image/png" sizes="144x144" href="img/320.png"/>

    <link rel="stylesheet" type="text/css" href="jquery-easyui-1.6.7/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="jquery-easyui-1.6.7/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="jquery-easyui-1.6.7/demo/demo.css">
    <link rel="stylesheet" type="text/css" href="jquery-easyui-1.6.7/themes/bootstrap/easyui.css">
    <script type="text/javascript" src="jquery-easyui-1.6.7/jquery.min.js"></script>
    <script type="text/javascript" src="jquery-easyui-1.6.7/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="jquery-easyui-1.6.7/jquery.color.js"></script>
    <script type="text/javascript" src="jquery-easyui-1.6.7/datagrid-export/datagrid-export.js"></script>
    <script type="text/javascript" src="jquery-easyui-1.6.7/locale/easyui-lang-zh_CN.js"></script>
    
    <script type="text/javascript" src="publicJS/Scancodetologin.js"></script>

    <style>

        #main {position: absolute;top:1px;bottom:1px;right:1px;left: 1px;background: #FEFCFB;}
        #main_1{position: absolute;top:15%;left: 40%;height: 400px;width: 300px;background: #FEFCFB;float: left;}

        #cen01{height: 75px;width: 300px;background: #FEFCFB;float: left;}
        #cen02{height: 270px;width: 300px;background: #FEFCFB;float: left;border: 1px solid #D0D0D0;background-color: #F0F0F0}
        #cen03{height: 30px;width: 300px;background: #FEFCFB;float: left;text-align: center;}
        #cen04 {
            float: left;
            margin-left: 100px;
            flex-shrink: 0;
            width: 100px;
            height: 40px;
            border-radius: 10px;
            background: #FF8000;
            font-size: 18px;
            color: white;
            text-align: center;
            padding-top: 7px;

            display: flex;
            flex-direction: row;
            justify-content: center;
            align-content: center;
        }
        .refresh-word{
            height: 100%;
        }
        #cen04:hover{color:#FF0000;box-shadow: 0 16px 32px 0 #ffab2e;/* 盒子悬浮时阴影 */}

        #bt{position: absolute;left: 50px;top:30px;
            color: #0b0800;font-size: 24px;text-align: left;font-weight: bold;font-family:KaiTi;
        }
        #lab3{color: #0b0800;font-size: 24px;text-align: left;font-family:KaiTi;}

        .sub-title {
            font-size: 20px;
        }
        #ewm{
            height: 269px;
            border: solid black 1px;
        }
    </style>

</head>
<body>

<div id="main">
    <div id="main_1">
        <div id="cen01">
            <img src="img/320.png" style="position: absolute;left: 1px;top:20px;" width="40px" height="40px"/>
            <label id="bt">翔轮 - 访客管理系统</label>
        </div>
        <div id="cen02">
            <img id="ewm" height="270px" width="300px">
        </div>
        <div id="cen03">
            <label id="lab3">倒计时</label>
        </div>
        <div id="cen04" onclick="shuaxin()"><span class="refresh-word">刷 新</span></div>

    </div>
</div>

</body>
</html>